<!DOCTYPE html>
<html>

<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>金额计算器</title>
  <link rel="stylesheet" href="./css/total_cost.css" />
  <!-- <script type="module" src="your-module.js"></script> -->

  <script src="./js/total_cost.js"></script>
  <!-- <script src="../node_modules/moment/"></script> -->

  <!-- <script type="module">
      import { greet } from "./module.js";
      console.log(greet());
    </script> -->
</head>

<body>
  <div class="jsq_page">
    <h1>总金额</h1>
    <div class="jsq_input">
      <input type="text" id="inputAmount" placeholder="请输入金额" />
      <button class="btn" onclick="calculate()">计算</button>
    </div>

    <div class="div_yy">
      <!-- // 区间值  左边 -->
      <div class="js_div">
        <div class="jsq_value">区间金额</div>
        <!-- //小于50w -->
        <div class="jsq_value">
          10-50w:
          <span id="result_50">0</span>
        </div>
        <!-- //小于100w -->
        <div class="jsq_value">
          50-100w:
          <span id="result_100">0</span>
        </div>
        <!-- //小于200w -->
        <div class="jsq_value">
          100-200w:
          <span id="result_200">0</span>
        </div>
        <!-- //小于500w -->
        <div class="jsq_value">
          200-500w:
          <span id="result_500">0</span>
        </div>
        <!-- //小于1000w -->
        <div class="jsq_value">
          500-1000w:
          <span id="result_1000">0</span>
        </div>
        <!-- //大于1000w -->
        <div class="jsq_value">
          超过1000w:
          <span id="result_10001">0</span>
        </div>
      </div>

      <!--      // 超出值  右边                 -->
      <div class="js_div_1">
        <div class="jsq_value_1">超出金额</div>
        <!-- //小于50w -->
        <div class="jsq_value_1">
          <span id="result1_50">0</span>
        </div>
        <!-- //小于100w -->
        <div class="jsq_value_1">
          <span id="result1_100">0</span>
        </div>
        <!-- //小于200w -->
        <div class="jsq_value_1">
          <span id="result1_200">0</span>
        </div>
        <!-- //小于500w -->
        <div class="jsq_value_1">
          <span id="result1_500">0</span>
        </div>
        <!-- //小于1000w -->
        <div class="jsq_value_1">
          <span id="result1_1000">0</span>
        </div>
        <!-- //大于1000w -->
        <div class="jsq_value_1">
          <span id="result1_10001">0</span>
        </div>
      </div>
    </div>
    <!-- 最终值： -->
    <div class="jsq_value_zz">
      最终值：
      <span id="result">0</span>
    </div>
  </div>
</body>

</html>